import React, {PureComponent} from 'react';
import * as api from './api';
import PropTypes from 'prop-types';
import Export from '../common/Export';
import {PERMISSION} from './constants';
import ImportPanel from './ImportPanel';
import {FORM_OPTIONS} from '../constants';
import {ListTypeCL, hasPermissions} from './utils';
import WrappedSelect from '../common/WrappedSelect';
import TagSelect from 'Shared/components/TagSelect';
import {injectIntl, formatMessage, language} from './intl';
import {Button, Form, Row, Col, Card, message} from 'antd';
import WrappedInputNumber from '../common/WrappedInputNumber';
import DealerSelectPanel from '../common/DealerSelect/SelectEdit';
import SearchSelectPanel from '../common/DutyUnitSelect/SelectEdit';
import {purchaseSaleInventoryOrderStatus, saleOrderBusinessType} from '../Enum';
const businessType = saleOrderBusinessType.toList(language);
const statusList = purchaseSaleInventoryOrderStatus.toList(language);
class QueryPanel extends PureComponent {
    state = {showImport: false};
    querySearch = () => {
        const {conditions} = this.props;
        if(!conditions.submitYear || !conditions.submitMonth)
            return message.warning(formatMessage({
                id: 'queryPanel.msg.submitMonthYear',
                defaultMessage: '请选择提报年份和提报月份'
            }));
        this.props.querySearch();
    }
    handleFilterChange = (value, name) => {
        this.props.onConditionsChange(name, value);
    }
    handleFilterPressEnter = (value, name) => {
        this.props.onConditionsChange(name, value);
        this.props.querySearch();
    }
    // eslint-disable-next-line react/sort-comp
    onSelectArea = data => {
        this.props.onConditionsChange('country', data.name);
        this.props.onSelectAreaChange({
            id: data.id,
            chineseName: data.chineseName
        });
    }
    onSelectDealer = data => {
        this.props.onConditionsChange('dealerId', data.id);
        this.props.onQueryDealerChange({
            id: data.id,
            code: data.code,
            name: data.name,
        });
    }
    onSelectMarke = data => {
        this.props.onConditionsChange('marketDepartmentId', data.id);
        this.props.onQueryMarkeChange({
            id: data.id,
            code: data.code,
            name: data.name,
        });
    }
    importChange = data => {
        if(data) {
            this.setState({showImport: false});
            message.success(formatMessage({
                id: 'queryPanel.msg.import',
                defaultMessage: '批量导入成功'
            }));
            this.props.querySearch();
        }
    }
    handleFilterSX = () => {
        this.props.querySearch();
        this.props.onClickSXBtn();
    }
    handleFilterZF = () => {
        this.props.querySearch();
        this.props.onClickZFBtn();
    }
    handleFilterGD = () => {
        this.props.querySearch();
        this.props.onClickGDBtn();
    }
    render() {
        const {conditions, onResetClick, loading,
            permissions, queryDealer, queryMarke, queryArea,
            isShowBatchSXPanel, isShowBatchFXPanel, isShowBatchGDPanel} = this.props;
        const {brands} = this.props.initEnumData;
        const operations = []; const otherBtns = [];
        const dealerInfo = conditions.dealerId ? {
            id: queryDealer.id,
            code: queryDealer.code,
            name: queryDealer.name
        } : null;
        const markeInfo = conditions.marketDepartmentId ? {
            id: queryMarke.id,
            code: queryMarke.code,
            name: queryMarke.name
        } : null;
        const countryInfo = conditions.country ? {
            id: queryArea.id,
            chineseName: queryArea.chineseName
        } : null;
        // if(hasPermissions(permissions, PERMISSION.batchEffective))
        //     otherBtns.push(
        //         <Button key="batchEffective" onClick={this.handleFilterSX}>
        //             {formatMessage({
        //                 id: 'queryPanel.btn.batchEffective',
        //                 defaultMessage: '批量生效'
        //             })}
        //         </Button>);
        if(hasPermissions(permissions, PERMISSION.batchAbandon))
            otherBtns.push(
                <Button key="batchAbandon" onClick={this.handleFilterZF}>
                    {formatMessage({
                        id: 'queryPanel.btn.batchAbandon',
                        defaultMessage: '批量作废'
                    })}
                </Button>);
        if(hasPermissions(permissions, PERMISSION.import))
            operations.push(<Button key="import" onClick={() => this.setState({showImport: true})}>
                {formatMessage({
                    id: 'queryPanel.btn.import',
                    defaultMessage: '批量导入'
                })}</Button>);
        if(hasPermissions(permissions, PERMISSION.batchSalePlanOrder))
            otherBtns.push(
                <Button key="batchSalePlanOrder" onClick={this.handleFilterGD}>
                    {formatMessage({
                        id: 'queryPanel.btn.batchSalePlanOrder',
                        defaultMessage: '批量生成滚动计划'
                    })}
                </Button>);
        return (
            <div>
                <Form className="form-standard">
                    <Card>
                        <Row>
                            {brands && brands.length > 1 &&
                                <Col {...FORM_OPTIONS.col}>
                                    <Form.Item
                                        label={formatMessage({
                                            id: 'queryPanel.form.brandId',
                                            defaultMessage: '品牌'
                                        })}
                                        {...FORM_OPTIONS.item}>
                                        <WrappedSelect
                                            allowClear
                                            name="brandId"
                                            value={conditions.brandId}
                                            options={brands}
                                            onChange={this.handleFilterChange}/>
                                    </Form.Item>
                                </Col>}
                            <Col {...FORM_OPTIONS.col}>
                                <Form.Item
                                    label={formatMessage({
                                        id: 'queryPanel.form.marketDepartmentId',
                                        defaultMessage: '大区'
                                    })}
                                    {...FORM_OPTIONS.item}>
                                    <SearchSelectPanel
                                        value={markeInfo}
                                        isLabelMap={false}
                                        allowClear={false}
                                        onSelect={this.onSelectMarke}
                                        getDutyUnits={api.getMarketDepartment}
                                        getDutyUnitSimple={api.getMarketDepartmentSimple}
                                        titleName={formatMessage({
                                            id: 'queryPanel.form.marketDepartmentId',
                                            defaultMessage: '大区'
                                        })}/>
                                </Form.Item>
                            </Col>
                            <Col {...FORM_OPTIONS.col}>
                                <Form.Item
                                    label={formatMessage({
                                        id: 'queryPanel.form.country',
                                        defaultMessage: '国家'
                                    })}
                                    {...FORM_OPTIONS.item}>
                                    <SearchSelectPanel
                                        value={countryInfo}
                                        getDutyUnits={api.getAreas}
                                        getDutyUnitSimple={api.getAreasSimple}
                                        titleName={formatMessage({
                                            id: 'queryPanel.form.country',
                                            defaultMessage: '国家'
                                        })}
                                        isCountry={true}
                                        onSelect={this.onSelectArea} />
                                </Form.Item>
                            </Col>
                            <Col {...FORM_OPTIONS.col}>
                                <Form.Item
                                    label={formatMessage({
                                        id: 'queryPanel.form.dealer',
                                        defaultMessage: '总代'
                                    })}
                                    {...FORM_OPTIONS.item} >
                                    <DealerSelectPanel
                                        value={dealerInfo}
                                        onSelect={this.onSelectDealer} />
                                </Form.Item>
                            </Col>
                            <Col {...FORM_OPTIONS.col}>
                                <Form.Item
                                    label={formatMessage({
                                        id: 'queryPanel.form.submitYear',
                                        defaultMessage: '提报年份'
                                    })}
                                    {...FORM_OPTIONS.item}>
                                    <WrappedInputNumber
                                        min={0}
                                        precision={0}
                                        name="submitYear"
                                        value={conditions.submitYear}
                                        onBlur={this.handleFilterChange} />
                                </Form.Item>
                            </Col>
                            <Col {...FORM_OPTIONS.col}>
                                <Form.Item
                                    label={formatMessage({
                                        id: 'queryPanel.form.submitMonth',
                                        defaultMessage: '提报月份'
                                    })}
                                    {...FORM_OPTIONS.item}>
                                    <WrappedInputNumber
                                        min={0}
                                        precision={0}
                                        name="submitMonth"
                                        value={conditions.submitMonth}
                                        onBlur={this.handleFilterChange} />
                                </Form.Item>
                            </Col>
                            <Col {...FORM_OPTIONS.col}>
                                <Form.Item
                                    label={formatMessage({
                                        id: 'queryPanel.form.businessType',
                                        defaultMessage: '业务类型'
                                    })}
                                    {...FORM_OPTIONS.item}>
                                    <WrappedSelect
                                        name="businessType"
                                        value={conditions.businessType}
                                        options={businessType}
                                        onChange={this.handleFilterChange}/>
                                </Form.Item>
                            </Col>
                            <Col {...FORM_OPTIONS.col}>
                                <Form.Item label={formatMessage({
                                    id: 'queryPanel.form.status',
                                    defaultMessage: '状态'
                                })} {...FORM_OPTIONS.item}>
                                    <TagSelect
                                        name="status"
                                        value={conditions.status}
                                        options={statusList}
                                        onChange={this.handleFilterChange} />
                                </Form.Item>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={6}>
                                <Button key="query" type="primary" onClick={this.querySearch} loading={loading}>
                                    {formatMessage({
                                        id: 'queryPanel.btn.query',
                                        defaultMessage: '查询'
                                    })}</Button>
                                <Button key="clear" onClick={onResetClick}>
                                    {formatMessage({
                                        id: 'queryPanel.btn.reset',
                                        defaultMessage: '重置'
                                    })}</Button>
                            </Col>
                            <Col span={18} className="col-align-right">
                                <Button.Group>{operations}{!isShowBatchSXPanel && !isShowBatchFXPanel &&
                                    !isShowBatchGDPanel && otherBtns}</Button.Group>
                                {hasPermissions(permissions, PERMISSION.export) &&
                                    <Export key={PERMISSION.export} exportRequest={this.props.onClickExport}/>}
                            </Col>
                        </Row>
                        {
                            this.state.showImport &&
                                <ImportPanel
                                    onCancel={() => this.setState({showImport: false})}
                                    onImportChange={this.importChange} />
                        }
                    </Card>
                </Form>
            </div>
        );
    }
}

QueryPanel.propTypes = {
    conditions: PropTypes.object.isRequired,
    initEnumData: PropTypes.object.isRequired,
    loading: PropTypes.bool.isRequired,
    permissions: PropTypes.array.isRequired,
    querySearch: PropTypes.func.isRequired,
    onClickExport: PropTypes.func.isRequired,
    onClickGDBtn: PropTypes.func.isRequired,
    onClickSXBtn: PropTypes.func.isRequired,
    onClickZFBtn: PropTypes.func.isRequired,
    onConditionsChange: PropTypes.func.isRequired,
    onQueryDealerChange: PropTypes.func.isRequired,
    onQueryMarkeChange: PropTypes.func.isRequired,
    onResetClick: PropTypes.func.isRequired,
    queryDealer: PropTypes.object,
    queryMarke: PropTypes.object,
    queryModel: PropTypes.object,
};
import {connect} from 'react-redux';
import * as actions from './actions';
import {createSelector} from 'reselect';
import selectorFactory from 'Shared/utils/immutableToJsSelectorFactory';
const getinitEnumData = createSelector(
    state => state.getIn(['page', 'domainData', 'init']),
    init => {
        const initData = init.toJS();
        const brands = initData.brands ? ListTypeCL(initData.brands) : [];
        return {
            brands
        };
    }
);
const getQueryArea = selectorFactory(['page', 'appState', 'queryArea']);
const getQueryMarke = selectorFactory(['page', 'appState', 'queryMarke']);
const getQueryDealer = selectorFactory(['page', 'appState', 'queryDealer']);
const getConditions = selectorFactory(['page', 'appState', 'queryCondition']);
const getPermissions = selectorFactory(['page', 'domainData', 'permission', 'data']);
const mapStateToProps = state => ({
    queryArea: getQueryArea(state),
    conditions: getConditions(state),
    queryMarke: getQueryMarke(state),
    initEnumData: getinitEnumData(state),
    queryDealer: getQueryDealer(state),
    permissions: getPermissions(state),
    loading: state.getIn(['page', 'domainData', 'list', 'isFetching']),
    isShowBatchSXPanel: state.getIn(['page', 'ui', 'showBatchSXPanel']),
    isShowBatchFXPanel: state.getIn(['page', 'ui', 'showBatchZFPanel']),
    isShowBatchGDPanel: state.getIn(['page', 'ui', 'showBatchGDPanel']),
});

const mapDispatchToProps = dispatch => ({
    querySearch: () => dispatch(actions.querySearch()),
    onClickExport: () => dispatch(actions.exportData()),
    onClickSXBtn: () => dispatch(actions.startBatchSX()),
    onClickZFBtn: () => dispatch(actions.startBatchZF()),
    onClickGDBtn: () => dispatch(actions.startBatchGD()),
    onResetClick: () => dispatch(actions.resetQueryPanel()),
    onSelectAreaChange: data => dispatch(actions.saveAreaQuery(data)),
    onQueryMarkeChange: data => dispatch(actions.saveMarkeQuery(data)),
    onQueryDealerChange: data => dispatch(actions.saveQueryDealer(data)),
    onConditionsChange: (name, value) => dispatch(actions.saveQueryCondition(name, value)),
});

export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(QueryPanel));
